//- 先去这个pug文件中找
extends ../commons/commons.pug

block append pageStyle
	link(href="${relativePath}/static/css/personCenter/refund.css" rel="stylesheet" type="text/css")

block content
	//- 退货退款内容
	div.refundContent
		div.refundTitle 退货退款
		//- 流程时间轴
		div.timelineBox
			div.line
				div.box.box1.current
					span.circle 1
					p.txt.firstTxt 采购商申请退货退款
				div.box.box2
					span.circle.circle2 2
					p.txt.twoTxt 等待供应商处理退货申请
				div.box.box3
					span.circle.circle3 3
					p.txt.threeTxt 等待系统审核
				div.box.box4
					span.circle.circle4 4
					p.txt.fourTxt 退款完成
		//- 商品信息
		div.shopsMsg
			div.shopMsgLeft.fl
				div.shopTitle 商品信息
				div.detailBox
					div.imgBox
						img(src="${relativePath}/static/imgs/latest02.png")
						p.nameTxt.fr 
					div.listTxt
						p
							| 单价：
							| <i class="dj"></i>
						p
							| 数量：
							| <i class="number"></i>
						p
							| 小计：
							| <i class="xj"></i>
					div.listTxt.listTxt2
						p
							| 订单编号：
							| <i class="bh"></i>
						p
							| 成交时间：
							| <i class="dealTime"></i>
						p
							| &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;总计：
							| <i class="allcount"></i>
			div.shopMsgRight.fl
				input(type="hidden" name="order_img")
				input(type="hidden" name="order_img01")
				input(type="hidden" name="order_img03")
				div.top
					label.justRefund 仅退款
					label.refundMoney 退货退款
					label.changeGoods.current 换货
				form#onlyRefund.onlyRefund
					div.row
						label 退款金额：
						input.txt.moneynum(type="text")
						p.remark *最高退回189.00,含运费0.00
					div.row
						label.goodZT 货物状态：
						select
							option 未收到货
					div.row.noMargin
						label.tkAcount 退款账户：
						div.zhAcount
							span.credit 账户余额
							//- span.accountNumber 账号：5632
					//- div.row
					//- 	label
					//- 	div.zhAcount.reBack 退回至原支付账户

					div.row
						label 退货原因：
						textarea.refundReason(rows="3" cols="4")
					div.row
						label 上传凭证：
						div.upImgBox.fl
							span.upBtn 上传图片 
								input(type="file" name="file" id="orderImg01" class="file" value="" accept="image/jpg,image/jpeg,image/png,image/bmp" multiple="multiple" )
							i 支持jpg、png、jpeg、bmp格式，单个图片小于4M
					div.imgsBox.imgsBox_2
					div.row
						p.agree
							label 
								input(type="checkbox" checked="checked" onclick="return false;")
								| &nbsp;我已阅读并同意
								| <a href="javascript:;">《退款须知》</a>
					div.row
						label
						input.subBtn(type="button" value="提交申请")
				form.onlyRefund#onlyMoney
					div.row
						label 退款金额：
						input.txt.moneynum(type="text")
						p.remark *最高退回189.00,含运费0.00
					div.row
						label.goodZT 货物状态：
						select
							option 未收到货
					div.row.noMargin
						label.tkAcount 退款账户：
						div.zhAcount
							span.credit 账户余额
							//- span.accountNumber 账号：5632
					//- div.row
					//- 	label
					//- 	div.zhAcount.reBack 退回至原支付账户

					div.row
						label 退货原因：
						textarea(rows="3" cols="4")
					div.row
						label 上传凭证：
						div.upImgBox.fl
							span.upBtn 上传图片 
								input(type="file" name="file" id="orderImg03" class="file" value="" accept="image/jpg,image/jpeg,image/png,image/bmp" multiple="multiple" )
							i 支持jpg、png、jpeg、bmp格式，单个图片小于4M
					div.imgsBox.imgsBox_3
					div.row
						p.agree
							label 
								input(type="checkbox" checked="checked" onclick="return false;")
								| &nbsp;我已阅读并同意
								| <a href="javascript:;">《退款须知》</a>
					div.row
						label
						input.subBtn(type="button" value="提交申请")
				form#changeGoods
					div.row
						label 换货原因：
						textarea.refundReason(rows="3" cols="4")
					div.row
						label 上传凭证：
						div.upImgBox.fl
							span.upBtn 上传图片 
								input(type="file" name="file" id="orderImg" class="file" value="" accept="image/jpg,image/jpeg,image/png,image/bmp" multiple="multiple" )
							i 支持jpg、png、jpeg、bmp格式，单个图片小于4M
					div.imgsBox.imgsBox_1
					div.row
						label
						input.subBtn(type="button" value="提交申请")


//- js
block append pageScript
	script.
		//- 获取商品详情
		$.post(shopIp+"/Order/info",{
			userToken:token,
			order_id:thisRequest.order_id,
			user_identity:"buyer"
		},function(data) {
			console.log(data);
			var goods = data.data.goods;
			$(".imgBox img").attr("src",goods.img);
			$(".nameTxt").html(goods.goods_name);
			$(".dj").html(goods.amount_price);
			$(".number").html(goods.goods_num);
			$(".xj").html(goods.amount_price);
			$(".bh").html(goods.order_sn);
			$(".dealTime").html(goods.finished_time);
			$(".allcount").html(goods.amount_price);
		})
		//- 点击退换货按钮
		$(function() {
			$(".shopMsgRight .top label").click(function() {
				$(this).addClass("current").siblings().removeClass("current");

				//- 点击对应显示隐藏
				var $index = $(this).index();
				$(".shopMsgRight form").hide().eq($index).show();
				
			})

			//- 图片上传
			$("input#orderImg").on("change", function() {
				$(".imgsBox_1").show();
				var wrap = $(".imgsBox_1");
				doUpload_img(this.files[0], function(data) {
					var imgUrl = $("input[name='order_img']").val();
					if(imgUrl) {
						$("input[name='order_img']").val(imgUrl + "," + data.data.path);
					} else {
						$("input[name='order_img']").val(data.data.path);
					}
					wrap.prepend("<span class='imgwarp imgwarp_01'><img src='"+data.data.url+"' path='"+data.data.path+"' class='upimgs'></img><i></i></span>");
					if($("span.imgwarp_01 img.upimgs").length > 3) {
						$("#orderImg").hide();
						$("#changeGoods .upBtn").hide();
					}
				});
			});
			//- 退款图片上传
			$("input#orderImg01").on("change", function() {
				$(".imgsBox_2").show();
				var wrap = $(".imgsBox_2");
				doUpload_img01(this.files[0], function(data) {
					var imgUrl = $("input[name='order_img01']").val();
					if(imgUrl) {
						$("input[name='order_img01']").val(imgUrl + "," + data.data.path);
					} else {
						$("input[name='order_img01']").val(data.data.path);
					}
					wrap.prepend("<span class='imgwarp imgwarp_02'><img src='"+data.data.url+"' class='upimgs' path='"+data.data.path+"'></img><i></i></span>");
					if($("span.imgwarp_02 img.upimgs").length > 3) {
						$("#orderImg01").hide();
						$("#onlyRefund .upBtn").hide();
					}
				});
			});
			//- 退货退款图片上传
			$("input#orderImg03").on("change", function() {
				$(".imgsBox_3").show();
				var wrap = $(".imgsBox_3");
				doUpload_img03(this.files[0], function(data) {
					var imgUrl = $("input[name='order_img03']").val();
					if(imgUrl) {
						$("input[name='order_img03']").val(imgUrl + "," + data.data.path);
					} else {
						$("input[name='order_img03']").val(data.data.path);
					}
					wrap.prepend("<span class='imgwarp imgwarp_03'><img src='"+data.data.url+"' class='upimgs' path='"+data.data.path+"'></img><i></i></span>");
					if($("span.imgwarp_03 img.upimgs").length > 3) {
						$("#orderImg03").hide();
						$("#onlyMoney .upBtn").hide();
					}
				});
			});
			//- 点击删除图片
			$(".imgsBox_1").on("click",".imgwarp_01 i",function() {
				$(this).closest(".imgwarp_01").remove();
				$("#orderImg").show();
				$("#changeGoods .upBtn").show();
			})
			//- 点击仅退款删除图片
			$(".imgsBox_2").on("click",".imgwarp_02 i",function() {
				$(this).closest(".imgwarp_02").remove();
				$("#orderImg02").show();
				$("#onlyRefund .upBtn").show();
			})
			//- 点击退货退款删除图片
			$(".imgsBox_3").on("click",".imgwarp_03 i",function() {
				$(this).closest(".imgwarp_03").remove();
				$("#orderImg03").show();
				$("#onlyMoney .upBtn").show();
			})
			//- 维修上传图片
			function doUpload_img(file, callback) {
				var formdata=new FormData($("#changeGoods")[0])
				//console.log(formdata);
				$.ajax({
					url:shopIp+"/Utils/uploadFiles?userToken="+token,
					type:"post",
					data:formdata,
					dataType:"json",
					async:false,
					cache:false,
					contentType:false,
					processData:false,
					success:function(data) {
						//alert(data.msg);
						//console.log(data.data.path);
						//$(".hiddenTxt").val(data.data.path);
						callback(data);
					},
					error:function(data) {
						layer.msg(data.msg);
					}
				})
			}
			//- 退款上传图片
			function doUpload_img01(file, callback) {
				var formdata=new FormData($("#onlyRefund")[0])
				//console.log(formdata);
				$.ajax({
					url:shopIp+"/Utils/uploadFiles?userToken="+token,
					type:"post",
					data:formdata,
					dataType:"json",
					async:false,
					cache:false,
					contentType:false,
					processData:false,
					success:function(data) {
						//alert(data.msg);
						//console.log(data.data.path);
						//$(".hiddenTxt").val(data.data.path);
						callback(data);
					},
					error:function(data) {
						layer.msg(data.msg);
					}
				})
			}
			//- 退货退款上传图片
			function doUpload_img03(file, callback) {
				var formdata=new FormData($("#onlyMoney")[0])
				//console.log(formdata);
				$.ajax({
					url:shopIp+"/Utils/uploadFiles?userToken="+token,
					type:"post",
					data:formdata,
					dataType:"json",
					async:false,
					cache:false,
					contentType:false,
					processData:false,
					success:function(data) {
						//alert(data.msg);
						//console.log(data.data.path);
						//$(".hiddenTxt").val(data.data.path);
						callback(data);
					},
					error:function(data) {
						layer.msg(data.msg);
					}
				})
			}

			//- 点击换货
			$(".changeGoods").click(function() {
				//$(".changeGoods").hide();
				$(".firstTxt").html("采购商申请退货退款");
				$(".twoTxt").html("等待供应商处理退货申请");
				$(".twoTxt").css({"left":"104px"});
			})
			//- 点击仅退款
			$(".justRefund").click(function() {
				$(".firstTxt").html("采购商申请仅退款");
				$(".twoTxt").html("等待供应商处理");
				$(".firstTxt").css({"left":"-46px"});
				$(".twoTxt").css({"left":"136px"});
			})

			//- 点击仅退款
			$("#onlyRefund .subBtn").click(function() {
				var imgsArr = [];
				$(".imgwarp_02 img").each(function() {
					imgsArr.push($(this).attr("path"));
				})
				$.post(shopIp+"/OrderBuyer/applyRefund",{
					userToken:token,
					order_id:thisRequest.order_id,
					refund_type:1,
					reason:$(".refundReason").val(),
					refund_amount:$(".moneynum").val(),
					imgs:imgsArr,
				},function(data) {
					if(data.status == 200) {
						layer.msg(data.msg);
						setTimeout(function() {
							location.reload();
						},1000);
					}else if(data.status== 402){
						layer.msg(data.msg);
						setTimeout(function() {
							location.reload();
						},1000);
					}else{
						layer.msg(data.msg);
					}
				})	
			})

			//- 点击退货退款
			$("#onlyMoney .subBtn").click(function() {
				var imgsArr = [];
				$(".imgwarp_03 img").each(function() {
					imgsArr.push($(this).attr("path"));
				})
				$.post(shopIp+"/OrderBuyer/applyRefund",{
					userToken:token,
					order_id:thisRequest.order_id,
					refund_type:2,
					reason:$("#onlyMoney textarea").val(),
					refund_amount:$("#onlyMoney .moneynum").val(),
					imgs:imgsArr,
				},function(data) {
					if(data.status == 200) {
						layer.msg(data.msg);
						setTimeout(function() {
							location.reload();
						},1000);
					}else if(data.status== 402){
						layer.msg(data.msg);
						setTimeout(function() {
							location.reload();
						},1000);
					}else{
						layer.msg(data.msg);
					}
				})	
			})

			//- 点击维修
			$("#changeGoods .subBtn").click(function() {
				var imgsArr = [];
				$(".imgwarp_01 img").each(function() {
					imgsArr.push($(this).attr("path"));
				})
				$.post(shopIp+"/OrderBuyer/applyRefund",{
					userToken:token,
					order_id:thisRequest.order_id,
					refund_type:3,
					reason:$("#changeGoods .refundReason").val(),
					imgs:imgsArr,
				},function(data) {
					if(data.status == 200) {
						layer.msg(data.msg);
						setTimeout(function() {
							location.reload();
						},1000);
						
					}else if(data.status== 402){
						layer.msg(data.msg);
						setTimeout(function() {
							location.reload();
						},1000);
					}else{
						layer.msg(data.msg);
					}
				})	
			})
		})


